<template>
<!-- 只能包含一个div -->
<!-- :init代表v-bind绑定 -->
  <!-- <div class="test">
    <h3>this is user's message: {{username}}</h3>
    <button @click="change">change username</button>
    
    <Left :init='"hahaha"'></Left>
    <Right></Right>
  </div> -->
  <div id="app">
    <router-view/>
  </div>
</template>

<script>
  //导入组件
  // import Left from"@/components/Left.vue"
  // import Right from"@/components/Right.vue"
  export default{
    //data数据源，vue组件中的data不能像之前一样，不能指向对象，组件中的data必须是一个函数
    // data(){
    //   //return中可以定义数据
    //   return{
    //     username:'admin',
    //   }
    // },
    // methods:{
    //   change(){
    //     //this表示当前组件的实例对象
    //     var that = this;
    //     that.username='hahaha';
    //   },
    //   //当前组件监听器
      
    // },
    // watch:{},
    //   //当前组件中的计算属性
    //   computed:{},
    //   components:{
    //     Left,
    //     Right
            
    //   }
    
  }
</script>
 <style>

#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}

 </style>


